var P6 = function (game) {

  this.create = function () {

    ClosePage(game, '6_0', '6', '6_r', '6_w');

    function Page(game, cbg, mbg, rbg, wbg) {
      var flagAry = [];  //0, 6, 7, 9, 4, 3, 2
      var bg = game.add.sprite(0, 0, mbg);
      bg.anchor.setTo(0, 0);

      var group = game.add.group();
      var originY = [];
      var originX = 1130;
      var tween, tweenBack;
      var style = {
        font: "18px bold",
        fill: "#000",
        boundsAlignH: "center",
        boundsAlignV: "middle",
      };
      var text;
      var drag;
      var rectGroup = game.add.group();
      var xPos = [ 959, 722, 627, 448, 370, 370, 370, 370];
      var names = [ '咖啡选择按钮', '热水按钮', '开水出水口', '蒸汽棒',  '蒸汽控制开关',  '不锈钢滴水盘', '组头接口', '咖啡组头'];
      var yPos = [ 560,  520, 560, 560,  406, 355, 300, 202];

      //var names = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11'];

      var rectAry = [];
      var bgrect;

      for (var i = 0; i < xPos.length; i++) {
        bgrect = game.add.sprite(xPos[i], yPos[i], 'rect');
        bgrect.data = i;
        bgrect.name = i;
        rectGroup.addAt(bgrect, i);
        rectAry[i] = '#';
      }

      for (var i = 0; i < names.length; i++) {
        flagAry.push('#')
        drag = game.add.sprite(1130, 160 + i * 50, 'rect');
        originY.push(160 + i * 50);
        text = game.add.text(10, 0, names[i], style);
        drag.addChild(text);
        text.font = 'Microsoft YaHei';
        text.fontWeight='bold';
        drag.data = i;
        drag.name = i;
        drag.inputEnabled = true;
        drag.input.useHandCursor = true;
        drag.input.enableDrag(false, true);
        group.addAt(drag, i);
        drag.events.onDragStop.add(fixLocation);
      }

      game.world.bringToTop(group);

      function getFillMap() {
        var temp = [];
        for (var i = 0; i < rectGroup.length; i++) {
          temp[i] = '#';
        }
        for (var i = 0; i < rectGroup.length; i++) {
          for (var j = 0; j < group.length; j++) {
            if (rectGroup.getByName(i).x === group.getByName(j).x
              && rectGroup.getByName(i).y === group.getByName(j).y) {

              temp[i] = j;
            }
          }
        }
        return temp;
      }


      function fixLocation(item) {
        var index = 20;
        var bounds = item.getBounds();
        rectGroup.children.forEach(function (obj, ip) {
          var boundsB = obj.getBounds();
          var flag = Phaser.Rectangle.intersects(bounds, boundsB);
          if (flag) {
            tween = game.add.tween(item).to({x: obj.x, y: obj.y}, 100, Phaser.Easing.Linear.None, true);
            if (rectAry[ip] != '#') {
              tweenBack = game.add.tween(group.getByName(rectAry[ip])).to({
                x: originX,
                y: originY[rectAry[ip]]
              }, 100, Phaser.Easing.Linear.None, true);
            }
            tween.onComplete.add(completed, this);

            flagAry[item.data] = ip;
            index = ip;
            return;
          }
        });
        if (index == 20) {
          tween = game.add.tween(item).to({
            x: originX,
            y: originY[item.data]
          }, 300, Phaser.Easing.Linear.None, true);
          tween.onComplete.add(completed, this);
          flagAry[item.data] = '#';
        }
      }

      function completed() {
        rectAry = getFillMap();
      }

      var retry = game.add.button(1080, 625, imgs['button'], onSubmit, this, 2, 1, 0);
      retry.name = 'retry';
      retry.width = 160;
      retry.height = 55;

      var submit = game.add.button(1250, 625, imgs['button'], onSubmit, this, 2, 1, 0);
      submit.name = 'submit';
      submit.width = 160;
      submit.height = 55;

      function onSubmit(arg) {
        //container.destroy();
          console.log(rectAry.join('_'))
        if (arg.name === 'submit') {
          if (rectAry.join('_') == '4_7_6_5_3_2_1_0') {
            RightPage(game, cbg, mbg, rbg, wbg);
          } else {
            WrongPage(game, cbg, mbg, rbg, wbg);
          }
        } else {
          game.goState('back');
        }
      }
    }


    function ClosePage(game, cbg, mbg, rbg, wbg) {
      var container = game.add.sprite(0, 0, '');
      var close = game.add.button(0, 0, cbg, onClose, this, 2, 1, 0);
      container.addChild(close);

      function onClose() {
        container.destroy();
        Page(game, cbg, mbg, rbg, wbg);
      }
    }

      function WrongPage(game,cbg,mbg,rbg,wbg){
          var container=game.add.sprite(0,0,'');

          var bg = game.add.image(0, 0, wbg);
          container.addChild(bg);
          var retry = game.add.button(1250, 625, imgs['button'], onClick, this, 2, 1, 0);
          retry.width = 160;
          retry.height = 55;
          container.addChild(retry);

          function onClick() {
              container.destroy();
              Page(game, cbg, mbg, rbg, wbg);
          }
      }

    function RightPage(game, cbg, mbg, rbg, wbg) {
      var container = game.add.sprite(0, 0, '');

      var bg = game.add.image(0, 0, rbg);
      container.addChild(bg);
      var next = game.add.button(1250, 625, imgs['button'], onClick, game, 2, 1, 0);
      next.width = 160;
      next.height = 55;
      container.addChild(next);

      function onClick() {
        game.goState('next');
      }
    }

  };


}

